<template>
    <div class="goodsEntry">
      <div style="padding:20px">
          <el-button type="primary" @click="returnOver">返回</el-button>
        
            <ul class="query">
                    <!-- <li class="query-item">
                     订单号：{{tableData[0].goods_name}}
                    </li>
                    <li class="query-item">
                     下单时间：新酒入库
                    </li>
                    <li class="query-item">
                    商品名称：
                    </li> -->
                    <li class="query-item">
                      购买总量：{{kindData.length}}
                    </li>
                    <!-- <li class="query-item">
                      用户ID：用户ID
                    </li>  -->
                  </ul>
          <div style="margin-top:20px">出库数量</div>
            <div class="wrapper">
                    <el-table class="table" :data="tableData" stripe highlight-current-row border>
                      
                   
                      <el-table-column align="center" prop="odorType" label="香型">
                        </el-table-column>
                     <el-table-column align="center" prop="netContent" label="净含量">
                      </el-table-column>
                    
                      <el-table-column align="center" prop="unit" label="单位">
                      </el-table-column>
                      <el-table-column align="center" prop="alocohl" label="酒精度">
                      </el-table-column>
                      <el-table-column align="center" prop="rawDesc" label="原料">
                      </el-table-column>
                     
                   
                    </el-table>
                   
            </div>
            <div>酒的信息</div>
            <div class="wrapper">
                    <el-table class="table" :data="kindData" stripe highlight-current-row border>
                      
                      <el-table-column align="center" prop="goodsId" label="商品ID">
                      </el-table-column>
                      <el-table-column align="center" prop="inFactoryTime" label="酒厂新酒入库时间">
                      </el-table-column>
                      <el-table-column align="center" prop="orderTime" label="下单时间">
                      </el-table-column>
                      <el-table-column align="center" prop="orderStatus" label="酒厂新酒出库时间">
                      </el-table-column>
                      <el-table-column align="center" prop="orderStatus" label="酒的状态">
                      </el-table-column>
                     
                    </el-table>
                   
            </div>
      </div>
     
    
    </div>
  </template>
  
  <script>
    export default {
      data() {
        return {
          height: "auto",
          skuNo:this.$route.params.id,
          kindData:[],
          
          
          tableData: [{}],
          
         
        };
      },
      mounted () {
        console.log(this.$route)
        this.tableList();
        this.infoList();
      },
      methods: {
           //初始化数据
      async tableList() {
        try {
            let { data } = await this.$post({
                api: "/show/outDetail",
                data:{
                    orderNo:this.skuNo
                }
              });
              if (data.code === 0) {

                  console.log(data)
                
                this.kindData = data.data;
                
              } else {
                this.$message({
                  type: "error",
                  message: data.msg
                });
              }
            } catch (e) {
              this.$message({
                type: "error",
                message: "接口报错"
              });
            }
        },
       
        async infoList() {
            try {
                let { data } = await this.$post({
                    api: "/show/skuinfo",
                    data:{
                        skuNo:this.$route.params.proId,
                        // status:1
                    }
                  });
                  if (data.code === 0) {

                     
                    this.tableData = data.data;
                   
                  } else {
                    this.$message({
                      type: "error",
                      message: data.msg
                    });
                  }
                } catch (e) {
                  this.$message({
                    type: "error",
                    message: "接口报错"
                  });
                }
            },
            returnOver(){
              this.$router.go(-1);
            }
      }
    };
  </script>
  
  <style lang="scss" scoped>
    .query {
      overflow: hidden;
      border-bottom: 1px solid #eeeeee;
      &-item {
        float: left;
        margin: 15px 20px;
      }
      .el-input {
        width: 150px;
      }
      .el-button {
        margin: 0 15px;
        &:last-child {
          margin-right: 0;
        }
      }
    }
  
    .entry-info {
      padding: 15px 20px;
      border-bottom: 1px solid #eeeeee;
    }
  
    .goods-category {
      line-height: 32px;
      span {
        color: #0033ff;
        text-decoration: underline;
        cursor: pointer;
      }
    }
  
    .goods-count {
      line-height: 32px;
    }
  
    .goods-id {
      display: flex;
      justify-content: space-between;
      padding: 0 40px;
      border-left: 1px solid #000;
      border-right: 1px solid #000;
      span {
        position: relative;
        display: inline-block;
        padding: 8px 15px;
        border: 1px solid #333;
        &:after {
          content: "";
          position: absolute;
          top: -6px;
          left: -6px;
          width: 100%;
          height: 100%;
          padding: 6px;
          border: 1px solid #333;
        }
      }
    }
  
    .wrapper {
      padding: 10px 15px;
    }
  
    .canceloff-btn {
      color: #0033ff;
      cursor: pointer;
    }
  </style>